/**
 * 公共样式
 * 补充一些colorUI没有但是设计图常用的样式
 * 一些兼容性样式等
 */

page {
    background: #F8F8F8;
    min-height: 100%;
}

[v-cloak] {
    display: none;
}
.bg-linear{
	background: $bg-linear;
}
.flex1{
	flex: 1;
}
.relative{
	position: relative;
}
.absolute{
	position: absolute
}
.center{
	display: flex;
	align-items: center;
	justify-content: center;
}

.text-prices {
  color: $priceColor;
}

.text-333 {
    color: #333333;
}

.text-666 {
    color: #666666;
}

.text-999 {
    color: #999999;
}

.text-bf {
    color: #BFBFBF;
}

.text-through {
    text-decoration: line-through;
}

.text-weight-400 {
    font-weight: 400;
}

.text-weight-500 {
    font-weight: 500;
}

.text-weight-600 {
    font-weight: 600;
}

.text-weight-700 {
    font-weight: 700;
}
.text-cut-1,
.text-cut-2,
.text-cut-3,
.text-cut-4,
.text-cut-5 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-all;
}
.text-cut-1 {
    -webkit-line-clamp: 1;
}
.text-cut-2 {
    -webkit-line-clamp: 2;
}

.text-cut-3 {
    -webkit-line-clamp: 3;
}

.text-cut-4 {
    -webkit-line-clamp: 4;
}

.text-cut-5 {
    -webkit-line-clamp: 5;
}

.height-88 {
    height: 88rpx;
}

.height-100 {
    height: 100rpx;
}

.safeArea-bottom {
    padding-bottom: 0;
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
}

.bg-theme {
    background: $theme;
}
.bg-themes {
    background: #CF2832;
}
.bg-theme-opacity {
  background: $bgthemeOpacity;
}
.btn-lg-theme {
		width: 100%;
		height: 88rpx!important;
		background-color: $bgtheme!important;
		color: #fff;
	}
.text-vecode {
  color: $theme;
}
.text-theme{
    color: $theme!important;
}

.line-theme,
.lines-theme {
    border:1px solid $theme!important;
}

.overHidden {
    overflow: hidden;
}

.word-break-all {
    word-break: break-all;
}

.placeholderClass {
    font-size: 32rpx;
    color: #BFBFBF;
}

.checkboxScale {
    transform: scale(0.65);
}

switch.theme[checked] .wx-switch-input,
checkbox.theme[checked] .wx-checkbox-input,
radio.theme[checked] .wx-radio-input,
switch.theme.checked .uni-switch-input,
checkbox.theme.checked .uni-checkbox-input,
radio.theme.checked .uni-radio-input {
    background: $theme!important;
    border-color: $theme!important;
    color: #ffffff!important;
}

uni-switch.green[checked] .wx-switch-input,
uni-checkbox.green[checked] .wx-checkbox-input,
uni-checkbox[checked] .wx-checkbox-input,
uni-radio.green[checked] .wx-radio-input,
uni-switch.green.checked .uni-switch-input,
uni-switch.checked .uni-switch-input,
uni-checkbox.green.checked .uni-checkbox-input,
uni-checkbox.checked .uni-checkbox-input,
uni-radio.green.checked .uni-radio-input,
uni-radio.checked .uni-radio-input {
    background-color: $theme !important;
    color: #ffffff !important;
    border-color: $theme !important;
}

uni-checkbox:not([disabled]) .uni-checkbox-input:hover {
    border-color: $theme !important;
}
switch.red[checked] .wx-switch-input.wx-switch-input-checked,
checkbox.red[checked] .wx-checkbox-input,
radio.red[checked] .wx-radio-input,
switch.red.checked .uni-switch-input.uni-switch-input-checked,
checkbox.red.checked .uni-checkbox-input,
radio.red.checked .uni-radio-input {
  background-color: $theme !important;
  border-color: $theme !important;
  color: #ffffff !important;
}
switch.olive[checked] .wx-switch-input,
checkbox.olive[checked] .wx-checkbox-input,
radio.olive[checked] .wx-radio-input,
switch.olive.checked .uni-switch-input,
checkbox.olive.checked .uni-checkbox-input,
radio.olive.checked .uni-radio-input {
  background-color: $theme !important;
  border-color: $theme !important;
  color: #ffffff !important;
}

switch.green[checked] .wx-switch-input,
/* switch[checked] .wx-switch-input, */
checkbox.green[checked] .wx-checkbox-input,
checkbox[checked] .wx-checkbox-input,
radio.green[checked] .wx-radio-input,
/* radio[checked] .wx-radio-input, */
switch.green.checked .uni-switch-input,
switch.checked .uni-switch-input,
checkbox.green.checked .uni-checkbox-input,
checkbox.checked .uni-checkbox-input,
radio.green.checked .uni-radio-input,
radio.checked .uni-radio-input {
  background-color: $theme !important;
  border-color: $theme !important;
  color: #ffffff !important;
  border-color: $theme !important;
}
// w-picker 加圆角
.w-picker .w-picker-cnt.visible {
    border-radius: 16rpx 16rpx 0px 0px !important;
    overflow: hidden!important;
}

// w-picker 标题栏高度
.w-picker .w-picker-header {
    height: 100rpx!important;
}

// w-picker 去掉山下边框线
.uni-picker-view-indicator::before {
    border-top: 1px solid transparent;
}

.uni-picker-view-indicator:after {
    border-bottom: 1px solid transparent;
}
uni-modal .uni-modal__bd{
  color: #333!important;
}
.title-block {
	&:before {
		display: block;
		content: ' ';
		width: 7rpx;
		height: 30rpx;
		background: $bgtheme;
		margin-right: 15rpx;
	}
}
.nav-tab {
  position: sticky;
  z-index: 99;
  .text-theme {
    position: relative;
    .active-line {
      position: absolute;
      bottom: 0rpx;
      left: 50%;
      transform: translateX(-50%);
      width: 50rpx;
      height: 4rpx;
      background: $theme;
      border-radius: 10rpx;
    }
  } 
}
@for $i from 10 through 750 {
  .fu-block-#{$i} {
    width: #{$i}rpx!important;
    height: #{$i}rpx!important;
  }
}
@for $i from 20 through 200 {
  .fu-fs#{$i} {
    font-size: #{$i}rpx!important;
  }
}
@for $i from 4 through 200 {
  .radius-#{$i} {
    border-radius: #{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .padding-top-#{$i} {
    padding-top: #{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .padding-bottom-#{$i} {
    padding-bottom: #{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .padding-left-#{$i} {
    padding-left: #{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .padding-right-#{$i} {
    padding-right: #{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .padding-tb-#{$i} {
   padding-top: #{$i}rpx!important ;
   padding-bottom: #{$i}rpx!important ;
  }
}
@for $i from 2 through 300 {
  .padding-lr-#{$i} {
    padding-left: #{$i}rpx!important ;
    padding-right: #{$i}rpx!important ;
  }
}
@for $i from 2 through 300 {
  .padding-#{$i} {
    padding:#{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .margin-#{$i} {
    margin:#{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .margin-top-#{$i} {
    margin-top: #{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .margin-bottom-#{$i} {
    margin-bottom: #{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .margin-left-#{$i} {
    margin-left: #{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .margin-right-#{$i} {
    margin-right: #{$i}rpx!important;
  }
}
@for $i from 2 through 300 {
  .margin-tb-#{$i} {
   margin-top: #{$i}rpx!important ;
   margin-bottom: #{$i}rpx!important ;
  }
}
@for $i from 2 through 300 {
  .margin-lr-#{$i} {
    margin-left: #{$i}rpx!important ;
    margin-right: #{$i}rpx!important ;
  }
}
@for $i from 2 through 1000 {
  .width-#{$i} {
    width: #{$i}rpx !important;
  }
}
@for $i from 2 through 1000 {
  .height-#{$i} {
    height: #{$i}rpx!important;
  }
}
@for $i from 2 through 1000 {
  .line-height-#{$i} {
    line-height: #{$i}rpx!important;
  }
}
 @for $i from 2 through 100 {
   .w#{$i} {		
      width: 1% * $i!important;
   }
 }
 @for $i from 2 through 100 {
   .h#{$i} {		
      height: 1% * $i!important;
   }
 }
.bg-f8{
  background-color: #f8f8f8;
}
.bg-f6 {
  background: #F6F7F9;
}
.flex-shrink{
  flex-shrink: 0;
}
.border-box{
	box-sizing: border-box;
}
.content-box{
	box-sizing: content-box;
}
.text-ellipsis {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.font-24 {
	font-size: 24rpx;
}
.width-224 {
	width: 224rpx;
}
.line-height-108 {
	line-height: 108rpx;
}
.font-32 {
	font-size: 32rpx;
}
.fu-block-24 {
	width: 24rpx;
	height: 24rpx;
}
.font-22 {
	font-size: 22rpx;
}
.fu-block-320 {
	width: 320rpx;
	height: 320rpx;
}
.font-28 {
	font-size: 28rpx;
}
.margin-right-104 {
	margin-right: 104rpx;
}
.margin-right-6 {
	margin-right: 6rpx;
}
.font-20 {
	font-size: 20rpx;
}
.margin-right-48 {
	margin-right: 48rpx;
}
.fu-block-280 {
	width: 280rpx;
	height: 280rpx;
}
.margin-top-32 {
	margin-top: 32rpx;
}
.padding-tb-32 {
	padding: 32rpx 0;
}
.font-36 {
	font-size: 36rpx;
}
.font-40 {
	font-size: 40rpx;
}
.height-160 {
	height: 160rpx;
}
.margin-top-26 {
	margin-top: 26rpx;
}
.text-underline {
	text-decoration: underline;
}